<template>
  <div>
    <h3>组件通讯ref</h3>
    <Child ref="child" />
    <button @click="handclick">获取子组件数据，或者调用子组件方法</button>
  </div>
</template>

<script>
import Child from './Child.vue'
export default {
  name: 'page-day31',
  components: { Child },
  methods: {
    handclick() {
      // 获取子组件的数据
      console.log(this.$refs.child.name)
      // 调用子组件的方法
      this.$refs.child.childFn('world')
      //获取子组件的数据msg
      console.log(this.$refs.child.msg)
    }
  }
}
</script>

<style lang="scss" scoped></style>
